<style scoped>
  .weui-form-preview__hd label, .weui-form-preview__hd em {
    font-size: .9em !important;
  }
  .rj-cell.max span{
    font-size: 16px;
    padding-right: 20px;
  }
  .rj-cell label {
    color: #333;
    font-size: 14px;
    width: 44%;
    display: inline-block;
    padding: 5px 3%;
    text-align: right;
  }
  .rj-cell span {
    font-size: 14px;
    color: #333;
    display: inline-block;
    width: 50%;
  }
  .rj-cell.note label{
    float: left;
  }
  .rj-cell.note span{
    width: 80%;
    display: inline-block;
  }
  .weui-cells {
    margin-top: 0;
  }
  .weui-cells_form {
    background: #fbfbfb;
  }
  .weui-cell {
    background: #fff;
  }
  #acts span {
    font-size: 14px;
  }
  .halfbtn {
    display: inline-block;
    width: 49%;
  }
  .weui-label{
    width: 130px;
    text-align: left;
  }

  .weui-select {
    height: auto;
    line-height: normal;
  }
  *{
    list-style:none;
  }
  #acts span {
    font-size: 14px;
  }

</style>
<template>
  <div class="comon">
    <div style="height: 50px; line-height: 50px; background: #f7f7f7; text-align: center; font-size: 16px; border-bottom: 1px solid #bdbbbc; position: relative">
      添加渠道信息
      <a href="javascript:;" @click="$router.back(-1)" style="position: absolute; left: 10px; top: 8px">
        <img src="@/assets/back.png" style="width: 20px" />
      </a>
    </div>
    <div class="weui-cells weui-cells_form">
      <form method="post" id="formid">
        <input class="weui-input" type="hidden"    id="customer" name="customer"  >
        <input class="weui-input" type="hidden"    id="orgname" name="orgname"  >
        <input class="weui-input"  type="hidden"  id="spename"   name="spename"   placeholder="请选择产品">
        <input class="weui-input"  type="hidden"  id="guid"   name="guid"    placeholder="请选择产品">

        <div class="cellgroup">


          <div class="weui-cell">
            <div class="weui-cell__hd"><label class="weui-label">规格 </label></div>
            <div class="weui-cell__bd">
              <select class="weui-select" name="productid"   id="productid"  >
                <option value="" disabled>请选择</option>
                <option    v-for="(item, index) in salesspecification" :key="item.guid" :packValue="item.description"  :productGuid="item.productGuid"  :textValue="item.name"  :value="item.guid">{{item.name}}</option>
              </select>
            </div>
          </div>

          <div class="weui-cell">
            <div class="weui-cell__hd"><label class="weui-label">包装</label></div>
            <div class="weui-cell__bd">
              <input class="weui-input"   id="packages"   name="packages"   placeholder="请选择产品">
            </div>
          </div>
          <div class="weui-cell">
            <div class="weui-cell__hd"><label class="weui-label">品种</label></div>
            <div class="weui-cell__bd">
              <select class="weui-select" name="product"   id="product">
                <option value="" disabled>请选择</option>
                <option    v-for="(item, index) in productinfo"  v-if="productGuid == item.guid"   :key="item.productname" :value="item.productname">{{item.productname}}</option>
              </select>
            </div>
          </div>


          <div class="weui-cell">
            <div class="weui-cell__hd"><label class="weui-label">部门</label></div>
            <div class="weui-cell__bd">
              <select class="weui-select" name="departid"   id="departid">
                <option value="" disabled>请选择</option>
                <option    v-for="(item, index) in departments"   :key="item.guid" :value="item.guid">{{item.name}}</option>
              </select>
            </div>
          </div>




        </div>
        <div class="weui-btn-area">
          <a class="weui-btn weui-btn_primary halfbtn subbtn"   href="javascript:" @click="send">提交</a>
          <a class="weui-btn weui-btn_primary halfbtn"  href="javascript:" @click="$router.back(-1)" id="sub">返回</a>
        </div>
      </form>
    </div>
  </div>
</template>

<script>
  import SalecontractitemModel from "../sellform/contract/SalecontractitemModel";
  export default {
    name: 'AddPurchasecontract',
    data () {
      return {
        openid: localStorage.openid,
        guid: '',
        type: 1,
        pickinglist: {},
        items: [],
          channel: [],
        specifications: [],
        organizations:[],
        partaorgguid:"",
        oitems: [0],
        customer:[],
        productinfo:[],
        salesspecification:[],
          departments:[],
          productGuid:''


      }
    },

    created() {
      window.addEventListener('setItem', ()=> {
        this.openid = localStorage.getItem('openid');
      })
    },
    mounted () {
      $("#starttime").calendar();
      let that = this;
      this.guid = this.$route.query.guid;
      this.type = this.$route.query.type;
      //获取回显数据

      this.getBaseInfo();
      this.getDeparts();
        $('#productid').change(() => {

            $('#packages').val($('#productid option:selected').attr('packValue'));
            $('#spename').val($('#productid option:selected').attr('textValue'));
            this.productGuid=$('#productid option:selected').attr('productGuid');
        });




    },
    computed: {

    },


    methods: {

      addItem: function(index) {
        this.salecontract.items.push(index);
      },
      delItem: function() {
        this.salecontract.items.pop();
      },

        getBaseInfo: function(guid) {
            this.axios({
                method: 'get',
                url: '/sales/Channel!getBaseInfo.action',
                params: {pickinglistid: guid}
            }).then((response) => {
                if (response.data.msg == 'success') {
                    let data = response.data;
                    this.salesspecification = data.salesspecification;
                    this.productinfo = data.productinfo;


                } else {
                    this.toastError("系统错误");
                }

            })
        },
      getDeparts: function() {
          this.axios({
              method: 'get',
              url: '/sales/Department!listAll.action',

          }).then((response) => {
              let data = response.data;
              if (data.info != 'error') {
                  this.departments = data.info;
              } else {
                  this.toast('获取部门数据失败！');
              }

          })
      },
      send: function() {
          var customer =  $('#customerid').find("option:selected").attr("textValue")
          var orgguid = $('#orgguid').find("option:selected").attr("textValue")

          $('#customer').val(customer);
          $('#orgname').val(orgguid)

        if (!this.checkSubmit()) {
          return false;
        }
        //防止重复提交
        $('.subbtn').attr("disabled",true).css("pointer-events","none");
        //显示提交状态
        $.showLoading("正在提交");

        let that  = this;
        this.axios({
          method: 'post',
          url: '/sales/Channel!save.action?pickinglistid=' + this.guid,
          params: this.serialize2Obj($("#formid").serializeArray())
        }).then(response => {
          //恢复提交按钮可点击
          $('.subbtn').attr('disabled', false).css("pointer-events","auto");
          //关闭提交状态
          $.hideLoading();

          if(response.data.msg == "success"){
            this.toastSuccess('操作成功!');
            this.$router.push({name: 'ChannelList', query: {guid:that.pickinglist.guid}});
          }  else {
            this.toastError('系统错误!');
          }
        }).catch(function (error) {
          //恢复提交按钮可点击
          $('.subbtn').attr('disabled', false).css("pointer-events","auto");
          //关闭提交状态
          $.hideLoading();
          that.toastError('系统错误');
        });

      },checkSubmit:function(){
        if(!this.isEmpty("productid")){
          this.toastText('请选择产品');
          return  false;
        }
        if(!this.isEmpty("departid")){
          this.toastText('请选择部门');
          return  false;
        }

        return true;
      },
      isEmpty:function(domId){
        if($("#" + domId).val() == null ||  $("#" + domId).val() ==''){
          return false;
        }else{
          return true;
        }
      }

    }
  }


</script>
